<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<table>
			<!-- 
			有时候表格是很长的，需要分为三部分
			 表头、表格的主体和表格底部
			 thead 表头
			 tbody 表格主体
			 tfoot 表格底部
			 都需要直接写到table 中
			 tr 写在这些标签中
			 
			 这样写的好处是
			 1、分别给出样式
			 2、打印分页的时候，能够显示表头
			 3、tfoot 就是写在上面，也能正常显示。thead也一样。
			 
			 注意：
			 1、如果没有tbody，浏览器会自动添加tbody，并且将所有的tr都放进去。
			 table>tr无法选中行，换成tbody>tr才能选中。
			 -->
			<thead>
				<tr>
					<th>日期</th>
					<th>收入</th>
					<th>支出</th>
					<th>合计</th>
				</tr>
			</thead>
			<tfoot>
				<tr>
					<td></td>
					<td></td>
					<td>合计</td>
					<td>100</td>
				</tr>
			</tfoot>
			<tbody>
				<tr>
					<td>100</td>
					<td>200</td>
					<td>300</td>
					<td>400</td>
				</tr>
				<tr>
					<td>100</td>
					<td>200</td>
					<td>300</td>
					<td>400</td>
				</tr>
				<tr>
					<td>100</td>
					<td>200</td>
					<td>300</td>
					<td>400</td>
				</tr>
				<tr>
					<td>100</td>
					<td>200</td>
					<td>300</td>
					<td>400</td>
				</tr>				
			</tbody>			
		</table>
	</body>
</html>
